var app = new Vue({
    el:"#buyer",
    data () {
        return {
            idcardFront: '', // 身份证正面预览
            idcardBack: '', // 身份证背面预览
            housingEstate: '请选择您的地址', // 小区地址
            address: '', // 详细地址
            fullAddress: '',
            supermarketName: '选择地址决定超市', // 超市名
            params: {
                realName: '', // 姓名
                mobile: '', // 手机号
                areaCode: '', // 小区areaCode
                address: '', // 详细地址
                supermarketId: '', // 超市Id
                idcardFrontFile: '', // 身份证正面文件
                idcardBackFile: '' // 身份证背面文件
            },
            btnDisabled: false, // 提交按钮是否可用
            layerShow: false, // 地址选择弹窗
            curIndex: 0,
            regions: [ // 区域列表数据
                {
                    id: 0,
                    name: '请选择',
                    list: []
                },
                {
                    id: 0,
                    name: '',
                    list: []
                },
                {
                    id: 0,
                    name: '',
                    list: []
                },
                {
                    id: 0,
                    name: '',
                    list: []
                },
                {
                    id: 0,
                    name: '',
                    list: []
                },
                {
                    id: 0,
                    name: '',
                    list: []
                }
            ],
            curList: [], // 区域当前列表数据
            isGetSupermarket: false,
            supermarketList: [],
            showAdd: false,
            isMarket: false
        }
    },
    watch: {
        curIndex (val) {
            this.curList = this.regions[val].list
        },
        regions: {
            deep: true,
            handler (val) {
                this.curList = val[this.curIndex].list
            }
        }
    },
    methods: {
        // 返回
        goback () {
            window.location.href = 'member_info_authentication.html'
        },
        // 获取超市
        showMarket () {
            this.isMarket = true
        },
        // 搜索小区弹窗显示
        showAddress () {
            this.showAdd = true
        },
        // 获取区域数据
        /* getAll () {
            Axios.post('area/area/getAllArea.do', {}).then(res => {
                this.regions[this.curIndex].list = res.data
            })
        }, */
        // 选择超市区域和分类分级获取数据
        /* changeMarket (list) {
            this.regions[this.curIndex].name = list.name
            this.regions[this.curIndex].id = list.code
            if (this.curIndex < 3) {
                this.curIndex++
                this.regions[this.curIndex].name = '请选择'
                this.regions[this.curIndex].list = list.child
            } else {
                if (!this.isGetSupermarket) {
                    let region = this.regions
                    this.housingEstate = region[0].name + region[1].name + region[2].name + region[3].name + region[4].name
                    this.params.areaCode = list.smallCommunityId
                    this.close()
                } else {
                    let areaCode = list.code
                    Axios.post('area/Supermarket/getSupermarket.do', { areaCode: areaCode}).then(res => {
                        if (res.respCode === 'S') {
                            this.supermarketList = res.data                            
                            this.close()
                            this.$refs.supermarket.show()
                        }
                    })
                }
            }
        }, */
        // 区域和分类分级获取数据
        /* select (list) {
            this.regions[this.curIndex].name = list.name
            this.regions[this.curIndex].id = list.code
            if (this.curIndex < 3) {
                this.curIndex++
                this.regions[this.curIndex].name = '请选择'
                this.regions[this.curIndex].list = list.child
            } else if (this.curIndex === 3) {
                this.curIndex++
                this.regions[this.curIndex].name = '请选择'
                Axios.post('area/SmallCommunity/getSmallCommunity.do', {areaCode: list.code}).then(res => {
                    this.regions[this.curIndex].list = res.data
                    this.curList = res.data
                })
            } else {
                if (!this.isGetSupermarket) {
                    let region = this.regions
                    this.housingEstate = region[0].name + region[1].name + region[2].name + region[3].name + region[4].name
                    this.params.areaCode = list.smallCommunityId
                    this.close()
                } else {
                    let areaCode = list.areaCode
                    Axios.post('area/Supermarket/getSupermarket.do', { areaCode: areaCode}).then(res => {
                        if (res.respCode === 'S') {
                            this.supermarketList = res.data                            
                            this.close()
                            this.$refs.supermarket.show()
                        }
                    })
                }
            }
        },
        choiceSupermarket(list) {
            this.supermarketName = list.name
            this.params.supermarketId = list.supermarketId
            this.$refs.supermarket.hide()
        },
        // 地址选择弹出层tab切换
        changeTab (index) {
            this.curIndex = index
            this.regions[index].name = '请选择'
            for (let i = index + 1; i < 5; i++) {
                this.regions[i] = {
                    id: 0,
                    name: '',
                    list: []
                }
            }
        },
        // 地址选择弹出层关闭按钮
        close () {            
            this.curIndex = 0
            this.regions[0].name = '请选择'
            for (let i = 1; i < 5; i++) {
                this.regions[i] = {
                id: 0,
                name: '',
                list: []
                }
            }
            if (this.isGetSupermarket) {
                this.isGetSupermarket = false
            }
            this.$refs.myPopup4.hide()
            this.$refs.changeMarket.hide()
        },
        closeSupermarket () {
            this.$refs.supermarket.hide()
        }, */
        // 搜索小区弹窗关闭
        changeShow (data) {
            this.showAdd = data
        },
        // 获取小区数据
        setHouseEstate (data) {
            this.housingEstate = data.houseEstate
            this.params.areaCode = data.addressOne
            this.fullAddress = data.fullAddress
        },
        // 搜索超市弹窗关闭
        changeMarket (data) {
            this.isMarket = data
        },
        // 获取小区数据
        setMarket (data) {
            this.supermarketName = data.supermarketName
            this.params.supermarketId = data.supermarketId
        },
        // 身份证正面预览
        showIdCardFront () {
            let self = this
            let inputDOM = this.$refs.idcardFrontFile;
            // 通过DOM取文件数据
            this.params.idcardFrontFile = inputDOM.files[0];
            var reader = new FileReader();
            reader.onload = function (evt) {
                var srcString = evt.target.result;
                //安卓获取的base64数据无信息头，加之
                if (srcString.substring(5, 10) != "image") {
                    srcString = srcString.replace(/(.{5})/, "$1image/jpeg;");
                }
                self.idcardFront = srcString;
            }
            if (self.params.idcardFrontFile) {
                reader.readAsDataURL(self.params.idcardFrontFile);
            }
        },
        // 身份证正面预览
        showIdCardBack () {
            let self = this
            let inputDOM = this.$refs.idcardBackFile;
            // 通过DOM取文件数据
            this.params.idcardBackFile = inputDOM.files[0];
            var reader = new FileReader();
            reader.onload = function (evt) {
                var srcString = evt.target.result;
                //安卓获取的base64数据无信息头，加之
                if (srcString.substring(5, 10) != "image") {
                    srcString = srcString.replace(/(.{5})/, "$1image/jpeg;");
                }
                self.idcardBack = srcString;
            }
            if (self.params.idcardBackFile) {
                reader.readAsDataURL(self.params.idcardBackFile);
            }
        },
        // 验证数据是否合法
        checkParam() {
            let self = this
            let data = self.params
            for (let i in data) {
                if (!data[i]) {
                    self.toast = self.$createToast({
                        txt: '请填写所有项',
                        type: 'txt'
                    })
                    self.toast.show()
                    return false
                } else if (i === 'mobile') {
                    if (!this.checkMobile(data[i])) {
                        self.toast = self.$createToast({
                            txt: '请填写正确的手机号码！',
                            type: 'txt'
                        })
                        self.toast.show()
                        return false
                    }
                }
            }
            return true
        },
        // 提交按钮
        sumbit () {
            let self = this
            let data = self.params
            data.address = this.fullAddress + this.housingEstate + this.address

            let param = new FormData()
            if (self.checkParam()) {
                for (let i in data) {
                    if (i === 'idcardFrontFile') {
                        param.append('file', data[i])
                    } else if (i === 'idcardBackFile') {
                        param.append('file', data[i])
                    } else {
                        param.append(i, data[i])
                    }
                }
            } else {
                return
            }
            if (!this.address) {
                self.toast = self.$createToast({
                    txt: '请输入您的详细住址！',
                    type: 'txt'
                })
                self.toast.show()
                return
            }
            self.btnDisabled = true
            Axios.post('user/authentication/applyProcurer.do', param).then(res => {
                if (res.respCode === 'S') {
                    this.toast = this.$createToast({
                        txt: '已经提交至系统审核,稍后会以短信的方式通知您',
                        type: 'txt'
                    })
                    this.toast.show()
                    self.btnDisabled = false
                    setTimeout(() => {
                        window.location.href = 'member_info_authentication.html'
                    }, 2000)
                } else {
                    this.toast = this.$createToast({
                        txt: res.errorMsg,
                        type: 'txt'
                    })
                    this.toast.show()
                    self.btnDisabled = false
                }
            })
        },
        // 验证手机号码
        checkMobile(key) {
            const reg = /^((1[3-9][0-9])+\d{8})$/
            return reg.test(key)
        }
    }
})